{{#containers-header showGroup=false}}
  <button
    class="btn btn-sm bg-default mr-10"
    disabled={{rbac-prevents
      resource="persistentvolumeclaim"
      scope="project"
      permission="create"
    }}
    type="button"
    {{action "importYaml"}}
  >
    {{t "nav.containers.importCompose"}}
  </button>
  {{#link-to "volumes.new" class="btn btn-sm bg-primary"}}
    {{t "nav.containers.addVolume"}}
  {{/link-to}}
{{/containers-header}}
<section class="pl-0 pr-0">
  {{#sortable-table
    classNames="grid sortable-table"
    body=rows
    searchText=searchText
    sortBy=sortBy
    bulkActions=true
    subRows=true
    descending=descending
    groupByKey=groupTableBy
    groupByRef="namespace"
    pagingLabel="pagination.volume"
    subHeaders=containerHeaders
    subSearchField="instances"
    headers=headers as |sortable kind obj dt|
  }}
    {{#if (eq kind "row")}}
      <tr class="main-row">
        <td class="row-check" valign="middle" style="padding-top: 2px;">
          {{check-box nodeId=obj.id}}
        </td>
        <td data-title="{{dt.state}}">
          {{badge-state model=obj}}
        </td>
        <td data-title="{{dt.name}}">
          <a href="{{href-to "volumes.detail" obj.id}}">
            {{obj.displayName}}
          </a>
        </td>
        <td data-title="{{dt.size}}">
          {{obj.displaySize}}
        </td>
        <td data-title="{{dt.volume}}">
          {{#if obj.persistentVolume}}
            <a
              href="{{href-to
                  "authenticated.cluster.storage.persistent-volumes.detail"
                  scope.currentCluster.id
                  obj.persistentVolume.id
                }}"
            >
              {{obj.persistentVolume.displayName}}
            </a>
          {{else}}
            <span class="text-muted">
              –
            </span>
          {{/if}}
        </td>
        <td data-title="{{dt.storageClass}}">
          {{#if obj.storageClass}}
            <a
              href="{{href-to
                  "authenticated.cluster.storage.classes.detail"
                  scope.currentCluster.id
                  obj.storageClass.id
                }}"
            >
              {{obj.storageClass.displayName}}
            </a>
          {{else}}
            <span class="text-muted">
              –
            </span>
          {{/if}}
        </td>
        <td data-title="{{dt.actions}}" class="actions">
          {{action-menu model=obj}}
        </td>
      </tr>
    {{else if (eq kind "group")}}
      {{namespace-group model=obj.ref fullColspan=sortable.fullColspan}}
    {{else if (eq kind "nomatch")}}
      <tr>
        <td
          colspan="{{sortable.fullColspan}}"
          class="text-center text-muted lacsso pt-20 pb-20"
        >
          {{t "volumesPage.noMatch"}}
        </td>
      </tr>
    {{else if (eq kind "norows")}}
      <tr>
        <td
          colspan="{{sortable.fullColspan}}"
          class="text-center text-muted lacsso pt-20 pb-20"
        >
          {{t "volumesPage.noData"}}
        </td>
      </tr>
    {{/if}}
  {{/sortable-table}}
</section>